<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>
<script>
    // ES6 允许使用“箭头”（=>）定义函数。

    // 如何将普通函数改为箭头函数
    // 1. 将普通函数改为匿名函数(所有的箭头函数都是匿名函数)
    // 2. 省略关键词function 在()后添加 =>
    // 3. 如果形参只有一个,()可以省略 (注意: 此时形参不能设置默认值,参数解构)
    //    如果没有形参,或者 形参超过一个 => 不能省
    // 4. 如果函数的执行语句只有一条,且是return语句  可以省略 {} 和 return
    //    注意: 如果函数的返回值是一个对象,需要用()包裹该对象 

    function add(a, b) {
        return a + b;
    }
    function double(n) {
        return n * 2;
    }

    // 1. 将普通函数改为匿名函数(所有的箭头函数都是匿名函数)
    var add = function (a, b) {
        return a + b;
    }

    var double = function (n) {
        return n * 2;
    }


    // 2. 省略关键词function 在()后添加 =>
    var add = (a, b) => {
        return a + b;
    }

    var double = (n) => {
        return n * 2;
    }

    // 3. 关于形参简写

    // 不能简写
    var add = (a, b) => {
        return a + b;
    }

    // 可以简写
    var double = n => {
        return n * 2;
    }

    // 4. 如果函数的执行语句只有一条,且是return语句  可以省略 {} 和 return
    var add = (a, b) => a + b;
    var double = n => n * 2;
    var tribble = n => ({
        dbl_val: n * 2,
        tri_val: n * 3,
    });

    console.log(add(1, 2));
    console.log(double(2));
    console.log(tribble(2));



    var list = [1, 4, 7, 8, 5, 2, 9, 6, 3]
    list.map(function (item) {
        return item + 10;
    })

    list.map((item) => {
        return item + 10;
    })

    list.map(item => {
        return item + 10;
    })

    var result = list.map(item => item + 10);
    console.log(result);
</script>

</html>